package showcase

import (
	"github.com/templui/templui/internal/components/form"
	"github.com/templui/templui/internal/components/radio"
)

templ RadioForm() {
	<div class="w-full max-w-sm">
		@form.Item() {
			@form.ItemFlex() {
				@radio.Radio(radio.Props{
					Name:    "radio-form",
					ID:      "r1",
					Checked: true,
				})
				@form.Label(form.LabelProps{
					For: "r1",
				}) {
					All new products
				}
			}
			@form.ItemFlex() {
				@radio.Radio(radio.Props{
					Name:     "radio-form",
					ID:       "r2",
					Disabled: true,
				})
				@form.Label(form.LabelProps{
					For: "r2",
				}) {
					Create a wishlist (Coming Soon)
				}
			}
			@form.ItemFlex() {
				@radio.Radio(radio.Props{
					Name: "radio-form",
					ID:   "r3",
				})
				@form.Label(form.LabelProps{
					For: "r3",
				}) {
					No notifications
				}
			}
			@form.Description() {
				You can change your preferences at any time.
			}
			@form.Message(form.MessageProps{
				Variant: form.MessageVariantError,
			}) {
				We will send you an email when new products are available.
			}
		}
	</div>
}
